.input {
  background: var(--mantine-color-bgColor-8);
  border: 1px solid var(--mantine-color-borderColor-0);
  border-radius: 6px;
  color: var(--mantine-color-fontColorStrong-1);
  font-size: 14px;
  height: 40px;
  min-height: 30px;
  // &:focus-within {
  //   border: 1px solid var(--mantine-color-borderColor-5);
  // }
}

.dropdown-on {
  input {
    border: 1px solid var(--mantine-color-borderColor-5);
  }
}

.dropdown-off {
  input {
    border: 1px solid var(--mantine-color-bgColor-8);
  }
}

.label {
  margin-bottom: 5px;
}

.error {
  font-size: 12px;
}

.dropdown {
  left: 0;
  right: 0;
  margin: 0 auto;
  border: 1px solid var(--mantine-color-borderColor-0);
  background: var(--mantine-color-bgColor-8);
  border-radius: 6px;
  overflow: hidden;
  padding: 0;
  color: var(--mantine-color-fontColorWeak-0);
}

.options {
  > div > div > div > div {
    padding-right: 0;
  }
}

.option {
  border-radius: 0;
  font-size: 14px;
  height: 40px;

  &:hover {
    background: none;
    background: var(--mantine-color-bgColor-9);
  }

  &[data-checked] {
    background: var(--mantine-color-bgColor-9);
    color: var(--mantine-color-fontColorStrong-1);
  }
}
